// 导航
let box = document.querySelector(".box");
let nav = document.querySelector(".top");
let nav2 = document.querySelector(".top2");
let btn = document.querySelector(".btn");
let daohang = nav.querySelector(".daohang");
let lis = daohang.querySelectorAll("ul li");

// 点击切换至登录页面
btn.onclick = function () {
  location.href = "../html/login.html";
};

// 点击切换导航栏高亮
lis.forEach(function (item, index) {
  item.onclick = function () {
    if (index == 0) {
      location.href = "../html/shouye.html";
    }
    if (index == 1) {
      location.href = "../html/shouye.html#matter1";
    }
    if (index == 2) {
      location.href = "../html/wisdom.html";
    }
    if (index == 3) {
      location.href = "../html/course.html";
    }
    if (index == 5) {
      location.href = "../html/case.html";
    }
   
  };
});

// 回到顶部
let customerService = document.querySelector(".customerService");
let back_top = customerService.querySelector(".back_top");

window.onscroll = function () {
  // 滚动到450显示回到顶部按钮
  if (!(scrollY >= 450)) {
    back_top.style.display = "none";
    return;
  }
  back_top.style.display = "block";
};

// 点击回到顶部
back_top.onclick = function () {
  scrollTo({ top: 0, behavior: "smooth" });
};

// 点击跳转登录页面
btn.onclick = function () {
  location.href = "../html/login.html";
};

// content1 实用工具数据渲染
let content1 = document.querySelector(".content1");
let content1_list = content1.querySelector(".list");
// console.log(content1_list);

data_content1.forEach((item) => {
  let str = `<div class="nav">
                <img
                  src="	${item.image}"
                  alt=""
                />
                <span>${item.title}</span>
                <p>
                  ${item.text}
                </p>
                <div class="square">立即体验</div>
              </div>`;
  content1_list.innerHTML += str;
});

// content3数据渲染
let content3 = document.querySelector(".content3");

data_content3.forEach((item) => {
  let str = `<div class="item">
            <img
              class="iteml"
              src="	${item.image}"
              alt=""
            />
            <div class="itemr">
              <div class="title">${item.title}</div>
              <div class="text"> ${item.text}</div>
            </div>
          </div>`;
  content3.innerHTML += str;
});
